<template>
    <div>布置作业</div>
    <input type="text" v-model="id">
    <button @click="handleAddWorkDone">布置完成</button>
    <br />
    <text>{{ workUrl }}</text>
    <button @click="goworkUrl">跳转到作业上传网址</button>
    <button @click="handleCopy">复制</button>
</template>
<script setup>
import { ref } from 'vue'
import { useRoute } from 'vue-router'
import useClipboard from "vue-clipboard3"

const route = useRoute()
console.log(route);
let id = ref(null)
const workUrl = ref(null)
const handleAddWorkDone = () => {

    workUrl.value = window.location.protocol + "//" + window.location.hostname + ":" + window.location.port + "/" + id.value
    // router.push({ name: 'subwork', params: { id: id.value } })

}

const goworkUrl = () => {
    window.open(workUrl.value, '_blank')
}

const { toClipboard } = useClipboard()

const handleCopy = async () => {
    try {
        await toClipboard(workUrl.value)
        console.log("复制成功！")
    } catch (error) {
        console.log("复制失败！" + error)
    }
}
</script>